const {merge} = require('webpack-merge');
const base = require('./webpack-base');
const {CleanWebpackPlugin} = require('clean-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
let devMode = process.env.NODE_ENV !== 'production';
devMode = true;
module.exports = merge(base, {
    mode:'production',
    devtool: 'source-map',
    output:{
        filename:'[name]-[hash].js'
    },
    module:{
        rules: [
            {
                test: /\.css$/,
                // loader执行顺序从最后一个开始
                use: [MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader'],
            },
            {
                test: /\.scss$/,
                // loader执行顺序从最后一个开始
                use: [MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader', 'sass-loader'],
            },
        ],
    },
    plugins:[
        new CleanWebpackPlugin(),
        new MiniCssExtractPlugin({
            // 这里的配置和webpackOptions.output中的配置相似
            // 即可以通过在名字前加路径，来决定打包后的文件存在的路径
            //filename: devMode ? 'css/[name].css' : 'css/[name].[hash].css',
            //chunkFilename: devMode ? 'css/[id].css' : 'css/[id].[hash].css',
            filename: '[name].[hash].css',
        })
    ]
});